/*
 * @Author: 史许荣
 * @Date: 2022-08-01 10:57:57
 * @LastEditors: 史许荣
 * @LastEditTime: 2022-08-03 14:39:00
 * @Description: file content
 * @FilePath: \react-three-fiber-new\src\SAFE.js
 */
import React from 'react'
import { a } from "@react-spring/three"
import { Html } from '@react-three/drei'

export default function SAFE({ position, type }) {
    return (<group position={position} rotation={[Math.PI / 2, 0, 0]}>
        <mesh scale={type == 'error' ? 0.15 : '0.1'}>
            <Html  transform>
                <img className='safe' src={type == 'error' ? "/SAFE2.png" : "/SAFE1.png"} />
            </Html>
        </mesh>
        {type == 'error' && <mesh>
            <Html transform  position={[0, 0, -2]} rotation={[Math.PI / 2, Math.PI / 1, Math.PI / 1]}>
                <div className={'safe3'}>
                    <div></div>
                    <div>烟雾警报</div>
                </div>
            </Html>
        </mesh>}
    </group>
    )
}